<template>
	<view style="width: 100%;">
		<u--input border="bottom" v-model="value" @focus="open" suffixIcon="arrow-right"></u--input>
		<u-datetime-picker :show="show" v-model="dateValue" @confirm='confirm' @cancel="cancel" @close="cancel"
			closeOnClickOverlay mode="date"></u-datetime-picker>
	</view>
</template>

<script>
	export default {
		props: {
			value: String
		},
		data() {
			return {
				show: false,
				dateValue: Number(new Date()),
				txtValue: ''
			}
		},
		methods: {
			open() {
				this.show = true
			},
			confirm(dateValue) {
				let txt = this.formatDate(dateValue.value, 'yyyy-M-d')
				this.$emit("input", txt)
				this.cancel()
			},
			cancel() {
				this.show = false
			}
		}
	}
</script>

<style>
</style>